<template>
    <div>
        <h2>排房</h2>

        <table class="table table-bordered">
            <tr>
                <td>房号:</td>
                <td>
                    <input type="text" disabled v-model="xianInfo.orderName">
                </td>
            </tr>
            <tr>
                <td>房型:</td>
                <td>
                    <select v-model="info.typeId">
                        <option value="">请选择</option>
                        <option v-for="item in xiainfo.list" :value="item.id">{{ item.typeName }}</option>
                    </select>
                </td>
            </tr>
            
            <tr>
                <td></td>
                <td>
                    <input type="button" @click="add" value="排房" class="btn btn-success">
                </td>
            </tr>
        </table>

    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { ref, reactive, onMounted } from 'vue';
import moment from 'moment';
import { useRoute, useRouter } from 'vue-router';
let route = useRoute();
let router = useRouter();

///////////////////////////////////////////////////////////////////////////////////////
onMounted(() => {
    showInfoOrder();
    show();
})

let info=reactive({
  "orderId": 0,
  "typeId": 0, 
});
let tyid=ref();
//显示数据
let xianInfo=reactive({
    orderName:'',
    typeName:''
});

//下拉列表查询条件
let tiao:any=reactive({
    index:1,
    size:999,
    xiaosize:0,
    bigsize:0,
    typeName:''
})

let xiainfo:any = reactive({
    list: [],
});

/////////////////////////////////函数/////////////////////////////////////////////////////
const add = () => {
    axios({
        url: 'https://localhost:7080/api/PaiRoom/AddPai',
        data:info,
        method: 'post'
    })
        .then(res => {
            if (res.data > 0) {
                alert('排房成功');
            } else {
                alert('排房失败')
            }
        })
}


//查询所属id的房号信息
const showInfoOrder = () => {
    axios({
        url: 'https://localhost:7080/api/RoomOrder/GetOrderByid',
        params: { id: route.query.id },
        method: 'get'
    })
        .then(res => {
            info.orderId = res.data.id;
            info.typeId = res.data.typeId;
            xianInfo.orderName = res.data.orderName;
                      
        })
}



//显示下拉
const show=()=>{
    axios({
        url:'https://localhost:7080/api/RoomType/GetRoomType',
        params:tiao,
        method:'get'
    })
    .then(res=>{
        xiainfo.list=res.data.list;
    })
}

</script>

<style scoped></style>